<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Set对象</title>
</head>

<body>
  <script>
    let arr = [12, 34, 23, 345, 123, 23, 34, 23, 12, 123]
    // Set 构造函数能让你创建 Set 对象，其可以存储任意类型的唯一值，无论是基本类型或者对象引用。
    // let mySet = Set(arr) // Constructor Set requires 'new'
    let mySet = new Set(arr)
    console.log(mySet); // Set(5) {12, 34, 23, 345, 123}  和arr比较，发现没有了重复的值

    // 常见的方法：
    mySet.add(7)  // 添加一个唯一的值到对象的末尾
    // mySet.add(34)  // 重复的值，不会新增

    mySet.delete(34) // 对象里面就没有34这个值

    mySet.has(345) // 有，返回true, 没有，就返回false.
    if (mySet.has(345)) {
      mySet.delete(123)
    }

    // 数据的使用：
    let arr1 = mySet.keys();
    console.log(arr1);//SetIterator {12, 23, 345, 7}
    let arr2 = mySet.values()
    console.log(arr2); //SetIterator {12, 23, 345, 7}
    let arr3 = mySet.entries()
    console.log(arr3); //SetIterator {12 => 12, 23 => 23, 345 => 345, 7 => 7}

    // set对象的Keys()和values()都是相同的。因为set对象的key\value是相同的。
    // 使用for-of来循环遍历Set对象：
    // for (const v of arr1) {
    //   console.log(v);
    // }
    // for (const v of arr2) {
    //   console.log(v);
    // }
    for (const [key, value] of arr3) {
      console.log(key, "---", value); //12 '---' 12
    }

    // 使用set实现数组去重复：
    let arr4 = [12, 34, 23, 345, 123, 23, 34, 23, 12, 123]
    let mySet2 = new Set(arr4)
    // mySet2.clear() // 清空对象的值
    // Array.from() 方法对一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。
    let newArr = Array.from(mySet2)
    console.log(newArr); //[12, 34, 23, 345, 123]

    // console.log(Array.from(new Set(arr4))); //[12, 34, 23, 345, 123]

  </script>
</body>

</html>